<template>
  <section class="popWindow" v-show="showWindow" @click="showWindow=!showWindow">
    <div class="window" @click.stop>
      <div class="tit">
        <img src="../assets/other/qdsy.png" alt="" class="qdsy">
        <img src="../assets/other/close.png" alt="" class="close" @click="showWindow=!showWindow">
      </div>
      <div class="cnt">
        <p>
          <span>
            <span>
            .
            </span>
            主动分享奖：
          </span>
          <span>
            {{price.accord / 100 | currency}}
            元
          </span>
        </p>
        <p>
          <span>
            <span>
            .
            </span>共享分润奖：
          </span>
          <span>
            {{price.shared /100 | currency}}
            元
          </span>
        </p>
        <p class="border-line">
          <span>
            <span>
              .
            </span>
            渠道管理奖：
          </span>
          <span>
            {{price.channel /100| currency}}
            元
          </span>
        </p>
        <p>
          <span>
            <span>
            .
            </span>
            业绩系数：
          </span>
          <span>
            {{price.resultsNum}}
          </span>
        </p>
        <p>
          <span>
            <span>
            .
            </span>
            销售业绩：
          </span>
          <span>
            {{ price.salesResults/100 | currencyTow}}
          </span>
        </p>
      </div>
    </div>
  </section>
</template>
<script>
  import { userInfoGet } from '../libs/publicMethod'  
  export default {
    data () {
      return {
        earning: '',
        showWindow: false,
        price: []
      }
    },
    methods:{
      // 显示弹窗
      showbox(val){
        let vm = this;
        vm.showWindow = val
      },
      // 计算收益
      computeEarnings(clearPrice, defaultPrice){
        let vm = this
        switch(userInfoGet().channelLv){
          case 1:
            vm.price.channel = (defaultPrice - clearPrice)*0.3*1; // 渠道管理奖
            break;
          case 2:
            vm.price.channel = (defaultPrice - clearPrice)*0.3*0.8; // 渠道管理奖
            break;
          case 3: 
            vm.price.channel = (defaultPrice - clearPrice)*0.3*0.6; // 渠道管理奖
            break;
          case 4:
            vm.price.channel = (defaultPrice - clearPrice)*0.3*0.4; // 渠道管理奖
            break;
        }        
        console.log(userInfoGet().channelLv)
        vm.price.accord = (defaultPrice - clearPrice)*0.2; // 主动分享奖
        vm.price.shared = (defaultPrice - clearPrice)*0.03; // 共享分润奖
        vm.price.resultsNum = Math.floor((1/(0.6/((defaultPrice - clearPrice)/defaultPrice)))*100)/100; // 业绩系数
        // .toFixed(2) 
        vm.price.salesResults = Math.floor(vm.price.resultsNum*defaultPrice*100)/100; // 销售业绩
      }
    },
    filters: {
      currency: function (value) {
        if (!value) return 0
        return value.toFixed(1)
      },
      currencyTow: function (value) {
        if (!value) return 0
        return parseInt(Math.floor(value*100)/100)
      }
    }
  }
</script>
<style>
.popWindow{
  position: fixed;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(0,0,0,.5);
  z-index: 100;
}
.window{
  width: 64%;
  margin-left: 18%;
  box-sizing: border-box;
  background-color: #BE1E1E;
  border-radius: 1rem;
}
.tit{
  position: relative;
  padding: .5rem;
}
.tit .qdsy{
  width: 60%;
}
.tit .close{
  position:absolute;
  width: 1rem;
  right: 1rem;
}
.window .cnt{
  background-color: white;
  border-radius: 1rem;
  padding: 1rem;
}
.cnt p{  
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  font-size: .85rem;
  padding: .25rem 0;
}
.cnt p span:nth-child(1){
  width: 60%;
  text-align: left;
}
.cnt p span:nth-child(2){
  width: 40%;
  text-align: left;
}
.border-line{
  width: 100%;
  border-bottom: 1px dashed #979BA0;
}
</style>
